<include file="Common/header" />
<title>费用收缴</title>
</head>
<body>
<nav class="breadcrumb">
	<i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 费用管理 
	<span class="c-gray en">&gt;</span> 费用收缴 
	<a class="btn btn-success radius r mr-20" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" >
		<i class="Hui-iconfont">&#xe68f;</i>
	</a>
</nav>
<div style="padding-left: 20px;padding-top: 20px;padding-right: 20px">
	<span style="display: inline-block;width: 280px;text-align: right">
		费用状态：
		<span class="select-box" style="width: 200px">
			<select class="select" size="1" name="costlog_status" id="costlog_status">
				<option value="0">--全部--</option>
				<option value="-1">未缴</option>
				<option value="1">已缴</option>
			</select>
		</span>
	</span>
	<span style="display: inline-block;width: 280px;text-align: right">
		业主姓名：
		<span class="select-box" style="width:200px">
			<input class="select form-control radius" id="owner_name" name="owner_name" />
		</span>
	</span>
	<span style="display: inline-block;width: 280px;text-align: right;margin-left: 13px;">
		账单时间：
		<span class="select-box" style="width:200px">
			<input class="select form-control layer-date" id="stime" name="stime" value="{$costlog_times}" />
		</span>
	</span>
	
	<a href="javascript:;" class="btn btn-success radius"><i class="Hui-iconfont">&#xe709;</i> 查询</a> 
</div>
<div class="pd-20">
	<div class="dataTables_wrapper no-footer" style="max-height: 400px;" id="ajaxDiv">
		<include file="Costlog/pay_list" />
	</div>
	<!--收费详情-->
	<div class="codeView" style="display: none;">
		<table class="table table-border table-bordered table-striped">
			<thead>
				<tr align="center">
					<input type="hidden" name="roomid" id="roomid" value="0" />
					<th colspan="16" align="center">费用详情</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td width="60" style="text-align: right">房间编号：</td>
					<td width="60"><p class="c-primary roomtitle"></p></td>
					<td width="60" style="text-align: right">业主姓名：</td>
					<td width="60"><p class="c-primary ownername"></p></td>
					<td width="60" style="text-align: right">费用笔数：</td>
					<td width="60"><p class="c-primary counts">4</p></td>
					<td width="60" style="text-align: right">应缴费用：</td>
					<td width="60"><p class="c-primary costlog_point"></p></td>
					<td width="60" style="text-align: right">滞纳金：</td>
					<td width="60"><p class="c-primary lastfree"></p></td>
					<td width="60" style="text-align: right">优惠金额：</td>
					<td width="60">
						<input type="text" class="input-text radius size-M" id="discount" name="discount" value="0.00" />
					</td>
					<td width="60" style="text-align: right">本次实缴：</td>
					<td width="60"><p class="c-primary account"></p></td>
					<td width="60" style="text-align: right">收费方式：</td>
					<td width="60">
						<span style="display: inline-block;width: 80px;text-align: right">
							<span class="select-box" style="width: 80px">
								<select class="select radius" size="1" name="costlog_pay" id="costlog_pay">
									<option value="1">现金</option>
									<option value="2">支付宝</option>
									<option value="3">微信</option>
								</select>
							</span>
						</span>
					</td>
				</tr>
				<tr>
					<td colspan="18"></td>
				</tr>
				<tr>
					<td colspan="18" style="text-align: center">
						<a href="javascript:;" class="btn btn-primary radius sure"><i class="Hui-iconfont">&#xe6a7;</i> 确认</a> 
					</td>
				</tr>
			</tbody>
		</table>
	</div>
</div>

<script type="text/javascript">
	$(function(){
		$("#stime").on('click', function(){
			laydate({istime: true, format: 'YYYY年MM月'});
		});
		
		//按条件查询
		$(".btn-success").on('click', function(){
			var load = layer.load(2);
			$(".codeView").hide();
			$("#roomid").val("0");
			
			var costlog_times = $("#stime").val();
			var where = {};
				where.costlog_status = $("#costlog_status").val();
				where.owner_name = $("#owner_name").val();
				where.costlog_times = $("#stime").val();
				where.ajax = 1;
			if(costlog_times == ""){
				layer.close(load);
				layer.msg('请选择账单时间', {icon: 0, time: {$Think.config.PROMPT_TIME}});
				return false;
			}
			
			$.get('pay.html', where, function(data){
				layer.close(load);
				$("#ajaxDiv").html(data);
			});
		});
		
		//缴费
		$("#discount").on('click', function(){
			var account = $(".account").val()/1;
			var discount = $("#discount").val()/1;
			
			$(".account").html(account - discount);
		});
		
		//缴费
		$(".sure").on('click', function(){
			var load = layer.load(2);
			var data = {};
				data.roomid = $("#roomid").val();
				data.times = $("#stime").val();
				data.discount = $("#discount").val();
				data.costlog_pay = $("#costlog_pay").val();
			$.post('ajaxpay.html', data, function(result){
				layer.close(load);
				if(result.errCode/1){
					layer.msg('缴费成功', {icon: 1, time: {$Think.config.PROMPT_TIME}}, function(){
						window.location.reload(); //刷新
					});
				}else{
					layer.msg('缴费失败', {icon: 0, time: {$Think.config.PROMPT_TIME}});
				}
			});
		});
	});
</script>
</body>
</html>